var page1 = document.querySelector('.page1');
var main_menu = document.querySelectorAll('#main-menu li');

var page2 = document.querySelector('.page2');
var canvas = document.querySelector('#canvas');
var bg = document.querySelector('.page2 #bg');
var stop_btn = document.querySelector('#stop');
var score = document.querySelector('.score');
var game_timer = document.querySelectorAll('.game-timer li');
var blood = document.querySelector('.blood-bar');

var page3 = document.querySelector('.page3');
var sub_menu = document.querySelectorAll('#sub-menu li');

var page4 = document.querySelector('.page4');
var continue_btn = document.querySelector('.continue');

var cHeight;
var cWidth;

var planeArr = {
	'player': {
		'blood': 100,
		'harm': 5,
		'height': 65,
		'width': 52,
		'speed': 5,
		'deathSrcArr': ['hero_die1.png', 'hero_die2.png', 'hero_die3.png', 'hero_die4.png']
	},
	'enemy1': {
		'blood': 10,
		'harm': {
			'shoot': 10,
			'collision': 20,
		},
		'score': 10,
		'height': 35,
		'width': 40,
		'speed': 2.5,
		'src': 'enemy1_fly1.png',
		'deathSrcArr': ['enemy1_down1.png', 'enemy1_down2.png', 'enemy1_down3.png', 'enemy1_down4.png']
	},
	'enemy2': {
		'blood': 20,
		'harm': {
			'shoot': 15,
			'collision': 30,
		},
		'score': 20,
		'height': 60,
		'width': 40,
		'speed': 2,
		'src': 'enemy2_fly1.png',
		'deathSrcArr': ['enemy2_down1.png', 'enemy2_down2.png', 'enemy2_down3.png', 'enemy2_down4.png']
	},
	'enemy3': {
		'blood': 100,
		'harm': {
			'shoot': 25,
			'collision': 100,
		},
		'score': 30,
		'height': 160,
		'width': 120,
		'speed': 1,
		'src': 'enemy3_fly1.png',
		'deathSrcArr': ['enemy3_down1.png', 'enemy3_down2.png', 'enemy3_down3.png', 'enemy3_down4.png', 'enemy3_down5.png',
			'enemy3_down6.png'
		]
	}
}

var props = {
	'ufo1': {
		'bullet': 'bullet2',
		'src': 'ufo1.png',
	},
	'ufo2': {
		'bullet': 'bullet1',
		'src': 'ufo2.png',
	},
	'ufo3': {
		'src': 'ufo3.png',
	}
}

var bulletArr = {
	'bullet1': {
		'height': 14,
		'width': 6,
		'src': 'bullet1.png',
	},
	'bullet2': {
		'height': 14,
		'width': 6,
		'src': 'bullet2.png',
	}
}

var degreeArr = [
	[90, 100],
	[80, 100],
	[70, 100],
	[60, 100],
	[50, 100],
	[50, 90]
]

var propHeight = 60;
var propWidth = 40;
var blood_width = parseInt(getComputedStyle(blood).width);

var game = new Game();

// 开始新游戏按钮
main_menu[1].addEventListener('click', function() {
	game.start();
});

sub_menu[1].addEventListener('click', function() {
	game.start();
});


// 暂停按钮
stop_btn.addEventListener('click', function() {
	game.stop();
});


// 继续游戏按钮
main_menu[0].addEventListener('click', function() {
	if (game.proceed()) {
		alert('没有进行中的游戏!');
	}
});

sub_menu[0].addEventListener('click', function() {
	game.proceed();
});



// 回到主页面按钮
sub_menu[2].addEventListener('click', function() {
	game.backHome();
});

continue_btn.addEventListener('click', function() {
	game.backHome();
});


// 游戏失去焦点暂停
document.addEventListener('mouseleave', function() {
	if (game.current == page2) {
		game.stop();
	}
	event.cancelBubble = true;
});


/**************键盘监听事件**************/
function keyDown() {
	switch (event.keyCode) {
		case 37:
			game.playerPlane.act['moveLeft'] = true;
			break;
		case 38:
			game.playerPlane.act['moveTop'] = true;
			break;
		case 39:
			game.playerPlane.act['moveRight'] = true;
			break;
		case 40:
			game.playerPlane.act['moveBottom'] = true;
			break;
		case 32: //空格
			game.playerPlane.act['shoot'] = true;
			break;
	}
};

function keyUp() {
	switch (event.keyCode) {
		case 37:
			game.playerPlane.act['moveLeft'] = false;
			break;
		case 38:
			game.playerPlane.act['moveTop'] = false;
			break;
		case 39:
			game.playerPlane.act['moveRight'] = false;
			break;
		case 40:
			game.playerPlane.act['moveBottom'] = false;
			break;
		case 32: //空格
			game.playerPlane.act['shoot'] = false;
			break;
	}
};
/**************键盘监听事件**************/




/**************交叉检测**************/
function testCross(obj1, obj2) {
	let x1 = obj1.x;
	let y1 = obj1.y;
	let w1 = obj1.node.offsetWidth;
	let h1 = obj1.node.offsetHeight;

	let x2 = obj2.x;
	let y2 = obj2.y;
	let w2 = obj2.node.offsetWidth;
	let h2 = obj2.node.offsetHeight;

	if (!(x1 > x2 + w2 || x1 + w1 < x2 || y1 > y2 + h2 || y1 + h1 < y2)) {
		return true;
	} else {
		return false;
	}
}
/**************交叉检测**************/


/**************死亡动画**************/
function dieAnimation(obj) {
	let time;
	let plane = planeArr[obj.type];
	obj.node.src = `img/${plane.deathSrcArr[0]}`;
	for (let i = 1; i < plane.deathSrcArr.length; i++) {
		time = 80 * i;
		setTimeout(function() {
			obj.node.src = `img/${plane.deathSrcArr[i]}`;
		}, time);
	}
	time += 80;
	setTimeout(function() {
		canvas.removeChild(obj.node);
	}, time);

}
/**************死亡动画**************/


/**************辅助函数**************/
// 随机数
function rnd(n, m) {
	return Math.floor(Math.random() * (m - n) + n);
}

// 假随机函数
Math.seed = 6;
Math.seededRandom = function(max, min) {
	max = max || 1;
	min = min || 0;
	Math.seed = (Math.seed * 9301 + 49297) % 233280;
	var rnd = Math.seed / 233280.0;
	return min + rnd * (max - min);
}

// 刷新页面
function play(callback) {
	window.requestAnimationFrame(() =>
		window.requestAnimationFrame(callback));
}
/**************辅助函数**************/
